//专门用来写头部加载和头部所有js的功能
define(['jquery'], () => {
    //使用$符号证明要使用jQuery
    class Header {
        constructor() {
            this.load()
        }
        load() {
            //专门加载html文件
            $('.header').load('/html/header.html', () => {
                //头部导航商品导航条-logo的效果
                $('.bar_logo').mouseenter(function () {
                    $('.mi_home').animate({
                        left: 0
                    }, 100)
                    $('.mi_logo').animate({
                        left: 55
                    }, 50)
                })
                $('.bar_logo').mouseleave(function () {
                    $('.mi_home').animate({
                        left: -55
                    }, 100)
                    $('.mi_logo').animate({
                        left: 0
                    }, 50)
                })
                // 搜索框.边框和下拉框
                $('body').on('click', $('.searchBoxForm1'), function (e) {
                    if (e.target.nodeName === 'INPUT' && e.target.className === 'searchBoxForm1') {
                        $('.search-box-form input').css({
                            border: "1px solid #ff6700"
                        })
                        $('.search-box-listbox').css(
                            'display', 'block'
                        )
                    } else {
                        $('.search-box-form input').css({
                            border: "1px solid #e0e0e0"
                        })
                        $('.search-box-listbox').css(
                            'display', 'none'
                        )
                    }
                })
                if (window.location.href != 'http://localhost:1995/') {
                    $('.goods_twoMenuBar').css('display', 'none')
                        .prev().css('opacity', '1')
                        .mouseenter(function () {
                            if ($(this).css('opacity') == 1) {
                                $('.goods_twoMenuBar').css({
                                    display: 'block',
                                    border: '2px solid #f40'
                                })
                                $('.goods_twoMenuBar ul').css({
                                    backgroundColor: 'rgba(255,255,255,1)',
                                })
                                $('.goods_twoMenuBar ul li a').css('color', '#000')
                                $('.goods_twoMenuBar ul li em').css({
                                    color: '#cccc',
                                    fontSize: '20px'
                                })
                            }
                        })
                    $('.link_blak').mouseleave(function () {
                        if ($(this).css('opacity') == 1) {
                            $('.goods_twoMenuBar').css('display', 'none')
                        }
                    })
                } else {
                    $('.goods_twoMenuBar').css('display', 'none')
                        .prev().css('opacity', '0')
                        .next().css('display', 'block')
                        .prev().mouseenter(function () {
                            if ($(this).css('opacity') == 1) {
                                $('.goods_twoMenuBar').css({
                                    display: 'block',
                                    border: '2px solid #f40'
                                })
                                $('.goods_twoMenuBar ul').css({
                                    backgroundColor: 'rgba(255,255,255,1)',
                                })
                                $('.goods_twoMenuBar ul li a').css('color', '#000')
                                $('.goods_twoMenuBar ul li em').css({
                                    color: '#cccc',
                                    fontSize: '20px'
                                })
                            }
                        })
                    $('.link_blak').mouseleave(function () {
                        if ($(this).css('opacity') == 1) {
                            $('.goods_twoMenuBar').css('display', 'none')
                        }
                    })
                }


            })
        }
    }
    return new Header()
})